<script>
	import rankItem from "./components/rankItem.vue"
	export default {
		components: {
			rankItem
		},
		data() {
			return {
				search:'',
				list:[],
				myInfo: {},
				readed: false,
				modalShow: false,
			}
		},
		onLoad() {
			this.rank()
			
			let timestamp = Date.now();
			if(uni.getStorageSync("readed_time")){
				var readed_time = Number(uni.getStorageSync("readed_time"))
			}else{
				var readed_time = 0
			}
			var cha = timestamp-readed_time;
			if(cha>86400000){
				this.readed = false
			}else{
				if(uni.getStorageSync("readed_time")){
					this.readed = true
				}
			}
		},
		onShow(){
			this.rank()
			this.getMyInfo();
		},
		onShareAppMessage() {
			this.readedFn2();
			return {
				title: '发布消息找到那个他/她',
				path: '/pages/index/index?id='+this.myInfo.me_invite_code,
				imageUrl: "https://seekerxcxoss.yiyankeji.vip/Label/Share_img.png"
			}
		},
		methods: {
			lists_count() {
				var that = this
				uni.request({
					url: getApp().globalData.host + '/api/My/getmessagewd',
					data: {
						message_type: 1
					},
					header: {
						memberid: uni.getStorageSync('member_id'),
						membertoken: uni.getStorageSync('member_token'),
					},
					success: (r) => {
						if(r.data.data){
							var count = r.data.data.wd_num
							console.log(count)
							uni.setTabBarBadge({
								index: 3,
								text: String(count)
							})
						}
					},
				})
			
			},
			getMyInfo() {
			
				var that = this
				uni.request({
					url: getApp().globalData.host + '/api/My/getMyInfo',
					header: {
						memberid: uni.getStorageSync('member_id'),
						membertoken: uni.getStorageSync('member_token'),
					},
					success: (r) => {
						that.myInfo = r.data.data
						that.lists_count()
					},
				})
			},
			sousuo(){
				this.rank()
			},
			rank(){
				var that = this
				uni.request({
					url:getApp().globalData.host+'/api/Seek/getLeaderboardList',
					data: {
						search: that.search,page:1,nums:100
					},
					header: {
						memberid:uni.getStorageSync('member_id'),
						membertoken:uni.getStorageSync('member_token'),
					},
					success:(r) => {
						that.list = r.data.data.list
					},
				})
			},
			readedFn2() {
				this.modalShow = false
				this.readed = true
				
				let timestamp = Date.now();
				uni.setStorageSync("readed_time", timestamp)
			},
			go2(url,index){
				console.log(index)
				if(index>0){
					uni.navigateTo({
						url:url
					})
				}else{
					if(this.readed==false){
						this.modalShow = true
					}else{
						uni.navigateTo({
							url:url
						})
					}
				}
			}
		}
	}
</script>
<template>
	<view class="rank-bg overflow-hidden">
		<image src="/static/rank/bg.png" mode="widthFix" class="w-full" style="position: absolute;z-index: 1;"></image>
		<div class="center fz34 text-gray-16 relative z-10" style="padding-top: 95rpx;padding-bottom: 300rpx">排行</div>

		<div class="bg-white h-full relative z-10 p-30 flex flex-col" style="align-items: stretch;">
			<div class="between flex-shirnk-0">
				<div class="flex rounded-50 h-70 px-30" style="width: 500rpx;background: #F9F9F9;">
					<image src="/static/index/search.png" mode="widthFix" class="w-30 flex-shirnk-0"></image>
					<input type="text" placeholder="支持精准搜索，多信息时可用#分割" class="w-full h-full ml-20 fz24" v-model="search">
				</div>
				<div class="bg-purple w-160 h-70 center rounded-50 text-white fz28" @click="sousuo()">搜索</div>
			</div>

			<div class="between px-25 mt-35 mb-35 flex-shirnk-0">
				<div class="flex">
					<div class="fz26 text-gray-16">排名</div>
					<div class="fz26 text-gray-16 ml-40 ">用户信息</div>
				</div>
				<div class="fz26 text-gray-16">提供茶水费</div>
			</div>
			
			<div class="list flex-1" style="overflow: auto;">
				<template v-for="(item,index) in list">
					<view @click="go2('/pages/detail/detail?id='+item.seek_id,index)">
						<rankItem :index="item.sort" :item="item"  />
					</view>
				</template>
				<nomore v-if="list.length == 0"></nomore>

				<div style="height: 500rpx;"></div>
			</div>

		</div>

		<div class="mask flex"  style="justify-content: center;align-items: flex-start;padding-top: 320rpx;" v-if="modalShow"> <!--@click="readedFn2"-->
			<div class="flex-col relative" style="margin-top:100rpx">
				<image src="/static/mask/line.png" class="absolute" mode="widthFix"
					style="width:170rpx;right:-50rpx; top:-250rpx"></image>
				<image src="/static/mask/title.png" mode="widthFix" style="width:500rpx"></image>
				<image src="/static/mask/pic.png" mode="widthFix" style="width:500rpx"></image>
				<div class="center mt-50" style="display: none;">
					<image src="/static/mask/confirm.png" mode="widthFix" style="width:214rpx"></image>
				</div>
			</div>
		</div>
	</view>
</template>



<style lang="less">
	

	.avatar {
		background: linear-gradient(to bottom, #CC62F4, #9D6BF6);
		border-radius: 50%;
		padding: 4rpx;
	}

	page {
		height: 100%;
	}

	.rank-bg {
		height: 100%;
		display: flex;
		flex-direction: column;
	}
	.mask {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.5);
		z-index: 99;
	}
</style>